<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<style>
body {
	background-image: url("3.jpg");
}
.box1{
            margin:0 auto;
            background: pink;
            width:1000px;
            height:700px;
            border:2px solid darkslategray;
            border-radius:30px;
            text-align: center;
            line-height: 50px;
position:absolute;
top:120px;
left:500px;
            }
</style>
</head>

<style type="text/css">
.alert {
	margin:10px 20px;
	text-align: center;
	font-size: 2.0em;
}
</style>
<script language="javascript">
    function changeF()
    {
            // 从下面的赋值可以的值，你在action 中只要得到name =“ccdd” 的值就可以了。
            document.getElementById('ccdd').value=document.getElementById('aabb').options[document.getElementById('aabb').selectedIndex].value;
    }
    function changeA()
    {
            // 从下面的赋值可以的值，你在action 中只要得到name =“ccdd” 的值就可以了。
            document.getElementById('B').value=document.getElementById('A').options[document.getElementById('A').selectedIndex].value;
    }
    function changeB()
    {
            document.getElementById('D').value=document.getElementById('C').options[document.getElementById('C').selectedIndex].value;
    }
    function changeC()
    {
            // 从下面的赋值可以的值，你在action 中只要得到name =“ccdd” 的值就可以了。
            document.getElementById('F').value=document.getElementById('E').options[document.getElementById('E').selectedIndex].value;
    }
    function changeD()
    {
            // 从下面的赋值可以的值，你在action 中只要得到name =“ccdd” 的值就可以了。
            document.getElementById('H').value=document.getElementById('G').options[document.getElementById('G').selectedIndex].value;
    }
</script>
				<div class="alert alert-info">
					<a class="close" data-dismiss="alert" href="#"></a>
				更多任务
				</div>
				<br>
			
<span style="absolute;margin-left:-12px;">
 <table cellspacing="0" cellpadding="0" width="0" border="0">
        <tr>
            <td align="left">
                <span style="position:absolute;border:1pt solid #c1c1c1;overflow:hidden;width:96px;height:19px;">
                    <select name="aabb" id="aabb" style="width:98px;height:20px;margin:-2px;" onChange="changeF();">
                    <option value="" style="color:#c2c2c2;">选择科目</option>
                    <option value="语文">语文</option>
                    <option value="数学">数学</option>
                    <option value="生物">生物</option>
                    <option value="历史">历史</option>
                     <option value="物理">物理</option>
                      <option value="化学">化学</option>
                    </select>
                </span>
                <span style="position:absolute;border-top:1pt solid #c1c1c1;border-left:1pt solid #c1c1c1;border-bottom:1pt solid #c1c1c1;width:82px;height:19px;">
                    <input type="text" name="ccdd" id="ccdd"  placeholder="选择科目" style="width:80px;height:15px;border:0pt;">
                </span>
            </td>
        </tr>
    </table>
</span>
 <div style="absolute;margin-left:110px;margin-top:-19px"><span style="absolute;margin-left:-12px;">
 <table cellspacing="0" cellpadding="0" width="0" border="0">
        <tr>
            <td align="left">
                <span style="position:absolute;border:1pt solid #c1c1c1;overflow:hidden;width:96px;height:19px;">
                    <select name="A" id="A" style="width:98px;height:20px;margin:-2px;" onChange="changeA();">
                   <option value="" style="color:#c2c2c2;">选择区域</option>
                    <option value="北京">北京</option>
                    <option value="上海">上海</option>
                    <option value="广西">广西</option>
                    <option value="广东">广东</option>
                     <option value="湖北">湖北</option>
                      <option value="云南">云南</option>
                    </select>
                </span>
                <span style="position:absolute;border-top:1pt solid #c1c1c1;border-left:1pt solid #c1c1c1;border-bottom:1pt solid #c1c1c1;width:82px;height:19px;">
                    <input type="text" name="B" id="B"  placeholder="选择区域" style="width:80px;height:15px;border:0pt;">
                </span>
            </td>
        </tr>
    </table>
</span></div>
<div style="absolute;margin-left:220px;margin-top:-19px"><span style="absolute;margin-left:-12px;">
 <table cellspacing="0" cellpadding="0" width="0" border="0">
        <tr>
            <td align="left">
                <span style="position:absolute;border:1pt solid #c1c1c1;overflow:hidden;width:96px;height:19px;">
                    <select name="C" id="C" style="width:98px;height:20px;margin:-2px;" onChange="changeB();">
                    <option value="" style="color:#c2c2c2;">选择指导学历</option>
                    <option value="小学">小学</option>
                    <option value="初中">初中</option>
                    <option value="高中">高中</option>
                    <option value="大学">大学</option>

                    </select>
                </span>
                <span style="position:absolute;border-top:1pt solid #c1c1c1;border-left:1pt solid #c1c1c1;border-bottom:1pt solid #c1c1c1;width:82px;height:19px;">
                    <input type="text" name="D" id="D"  placeholder="选择指导学历" style="width:80px;height:15px;border:0pt;">
                </span>
            </td>
        </tr>
    </table>
</span></div>
<div style="absolute;margin-left:330px;margin-top:-19px"><span style="absolute;margin-left:-12px;">
 <table cellspacing="0" cellpadding="0" width="0" border="0">
        <tr>
            <td align="left">
                <span style="position:absolute;border:1pt solid #c1c1c1;overflow:hidden;width:96px;height:19px;">
                    <select name="E" id="E" style="width:98px;height:20px;margin:-2px;" onChange="changeC();">
                <option value="" style="color:#c2c2c2;">性别</option>
                    <option value="男">男</option>
                    <option value="女">女</option>
                    <option value="性别不限">性别不限</option>
                    </select>
                </span>
                <span style="position:absolute;border-top:1pt solid #c1c1c1;border-left:1pt solid #c1c1c1;border-bottom:1pt solid #c1c1c1;width:82px;height:19px;">
                    <input type="text" name="F" id="F"  placeholder="性别" style="width:80px;height:15px;border:0pt;">
                </span>
            </td>
        </tr>
    </table>
</span>
</div>
<div style="absolute;margin-left:440px;margin-top:-19px"><span style="absolute;margin-left:-12px;">
 <table cellspacing="0" cellpadding="0" width="0" border="0">
        <tr>
            <td align="left">
                <span style="position:absolute;border:1pt solid #c1c1c1;overflow:hidden;width:96px;height:19px;">
                    <select name="G" id="G" style="width:98px;height:20px;margin:-2px;" onChange="changeD();">
                  <option value="" style="color:#c2c2c2;">时长</option>
                    <option value="1小时以内">1小时以内</option>
                    <option value="1-2小时">1-2小时</option>
                    <option value="2-3小时">2-3小时</option>
                    <option value="3-4小时">3-4小时</option>
                     <option value="一天">一天</option>
                      <option value="超过一天">超过一天</option>
                    </select>
                </span>
                <span style="position:absolute;border-top:1pt solid #c1c1c1;border-left:1pt solid #c1c1c1;border-bottom:1pt solid #c1c1c1;width:80px;height:19px;">
                    <input type="text" name="H" id="H"  placeholder="时长" style="width:80px;height:15px;border:0pt;">
                </span>
            </td>
        </tr>
    </table>
</span></div>
<div style="absolute;margin-left:550px;">
						<button type="submit">搜索</button>
					</div>
				<table style="width: 100%;margin-top: 20px;">		
		<div style="height: 400px;width:800px; background-color:green;border: 1px solid #eee;float:center;solid navy;overflow-x:scroll">
	
		
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		<div style="height: 100px;width:80px; background-color:blue;border: 1px solid #eee;float:left;margin:20px"></div>
		
		
		
		</div></table>	
</html>